<template>
  <view>
    <z-paging class="container" ref="paging" v-model="dataList" @query="queryList">

      <div class="card_item" style="height: auto; margin-left: 30rpx; margin-right: 30rpx; margin-top: 30rpx;">
        <div style="display: flex; justify-content: space-between">
          <div class="card_item_orderNo">
            <span style="color: rgba(16, 16, 16, 1)">总设备数</span>
            <span style="margin-left: 6rpx">{{ total }}</span>
          </div>
        </div>
      </div>

      <div style="margin-top: 26rpx; margin-left: 30rpx; margin-right: 30rpx;" class="card_item"
        v-for="(item, index) in dataList" :key="index">
        <div style="display: flex; justify-content: space-between">
          <div class="card_item_orderNo">{{ item.mainname }}</div>
          <div class="card_item_title">电量：{{ item.voltage || 0 }}</div>
        </div>

        <div class="card_item_title" style="margin-top: 20rpx">
          {{ item.hospitaldepartments.build }}号楼 {{ item.hospitaldepartments.floor }}层 {{
            item.hospitaldepartments.deptname }} {{ item.position || "" }}
        </div>
      </div>

    </z-paging>


  </view>
</template>

<script>
import { warehouseHistory } from "@/api/index";
export default {
  data() {
    return {
      // v-model绑定的这个变量不要在分页请求结束中自己赋值，直接使用即可
      dataList: [],
      list: [
        // {
        //   // 设备号
        //   deviceId: "SN564564654",
        //   // 位置
        //   lcoation: "儿科8楼",
        //   // 电量
        //   light: 10,
        // },
      ],
      // 总数
      total: 0,
    };
  },

  /**
   * 生命周期函数--监听页面加载
   */
  async onLoad(options) {
  },

  methods: {
    queryList(pageNo, pageSize) {
      const app = this;

      // 此处请求仅为演示，请替换为自己项目中的请求
      warehouseHistory({ page: pageNo, limit: pageSize, hospital_id: uni.getStorageSync("curHospital"), }).then(res => {

        app.total = res.total;

        // 将请求结果通过complete传给z-paging处理，同时也代表请求结束，这一行必须调用
        app.$refs.paging.complete(res.list);
      }).catch(res => {
        console.log('res', res);

        // 如果请求失败写this.$refs.paging.complete(false)，会自动展示错误页面
        // 注意，每次都需要在catch中写这句话很麻烦，z-paging提供了方案可以全局统一处理
        // 在底层的网络请求抛出异常时，写uni.$emit('z-paging-error-emit');即可
        app.$refs.paging.complete(false);
      })
    }
  },
};
</script>

<style lang="scss" scoped>
page {
  height: 100%;
  margin: 30rpx;
}

.container {
  min-height: 100vh;
  background: #f4f4f4;

}

.card_item {
  // height: 150rpx;
  line-height: 40rpx;
  border-radius: 24rpx;
  background-color: rgba(255, 255, 255, 1);
  color: rgba(16, 16, 16, 1);
  font-size: 28rpx;
  text-align: center;
  font-family: PingFangSC-regular;

  padding: 20rpx 30rpx;
}

.card_item_orderNo {
  color: #101010;
  font-size: 32rpx;
  text-align: left;
  font-family: PingFangSC-regular;
}

.card_item_title {
  color: rgba(16, 16, 16, 1);
  font-size: 32rpx;
  text-align: left;
  font-family: PingFangSC-regular;
}
</style>
